<template>
<div>
    <h1>登录界面</h1>
    <table class="table" border="1">
        
        <tr>
            <td>用户名</td>
            <td><input type="text" placeholder="请输入用户名" v-model="username"></td>
        </tr>
        <tr>
            <td>密码</td>
            <td><input type="password" placeholder="请输入密码" v-model="password"></td>          
        </tr>
        <tr>
            <td colspan="2"><button @click="login">登录</button></td>
        </tr>
    </table>
</div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter();
const username = ref('');
const password = ref('');

const login =  () => {
    if(username.value==''||password.value==''){
        alert('用户名或密码不能为空');
        return;
    }
    else if(username.value!='Admin123'&&password.value!='Admin123')
    {
        alert('登录名和密码必须是Admin123');
        return;

    }
    else if(username.value=='Admin123'&&password.value=='Admin123')
    {
        alert('登录成功');
        router.push('/LoginShow');
        alert(username.value+', '+password.value);
    }
    else{
        alert('登录失败');
    }   

}

</script>
